<?php
	include "../../public/commom/config.php";
	include "../../public/commom/commom.php";
?>

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>分类</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
		<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
		<link rel="stylesheet" type="text/css" href="../public/css/index.css"/>
		<style type="text/css">
		</style>
	</head>

	<body>
		<div id="head">
			<a onclick="javascript:history.back(-1);"><i class="fas fa-arrow-left"></i></a>
			<a href="../index.php"><i class="fas fa-home"></i></a>
		</div>
		<div id="class">
			<div class="class-left">
				<ul>
					<?php
						$class_id = $_GET["class_id"];
						
						$sql = "SELECT * FROM class";
						
						$result = mysqli_query($conn, $sql);
						
						while($row = mysqli_fetch_assoc($result)) {
							echo "<li><a href='right.php?class_id=" . $row["id"] . "' target='class-right'>" . $row["name"] . "</a></li>";
						}
						
						mysqli_close($conn);
					?>
				</ul>
			</div>
			<div class="class-right">
				<iframe src="right.php?class_id=<?php echo $class_id; ?>" name="class-right" width="100%" height="100%"></iframe>
			</div>
		</div>
		
		
		
		<script type="text/javascript">
			var oClas = document.getElementById("class");
			var aClasLi = oClas.getElementsByTagName("li");
			
			aClasLi[<?php echo $class_id - 1 ; ?>].className = "class-color";
			
			for (var i = 0; i < aClasLi.length; i++) {
				aClasLi[i].index = i;
				
				aClasLi[i].onclick = function () {
					
					for (var i = 0; i < aClasLi.length; i++) {
						aClasLi[i].className = "";
					}
					
					aClasLi[this.index].className = "class-color";
				}
			}
		</script>
	</body>

</html>